import { defineComponent, h, VNode, FunctionalComponent, Slots } from "vue"

export const titleName = defineComponent({
  setup(props, { slots }) {
    return () => h("h1", {}, slots.default && slots.default())
  }
})

export function createTitleTemplate() {
  // eslint-disable-next-line no-unused-vars
  let renderSlot: ((props: {}) => VNode[] | undefined) | null = null;

  const DefineTemplate = {
    setup(_: {}, { slots } : { slots: Slots }) {
      return () => {
        renderSlot = slots.default || null
      }
    }
  }
  const UserTemplate: FunctionalComponent = (_props) => renderSlot && renderSlot(_props)
  return [DefineTemplate, UserTemplate]
}